<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="Keywords" content="">
	<meta name="description" content="">
    <title>视频播放页面</title>
    <link rel="shortcut icon" type="image/x-icon" href="skin/images/favicon.ico">
    <!--公共部分-->
    <link href="skin/css/layout.css" type="text/css" rel="stylesheet" />
	<script src="skin/js/jquery-1.11.1.min.js" type="text/javascript"></script>
    <!--私有部分-->
    <link href="skin/css/default.style.css" type="text/css" rel="stylesheet" />
	<script src="skin/js/default.common.js" type="text/javascript"></script>
	<script src="skin/js/plugin.js" type="text/javascript"></script>
</head>
<body>
<div class="wrap">
	<!--star header-->
    <div class="v_header">
    	<div class="header">
        <!--star 顶部-->
        <div class="h_top">
            <div class="w1200">
                <div class="t_siten_l">
                    <ul class="wList00">
                        <li><a href="#">网校首页</a></li>
                        <li><a href="#">视频网课</a></li>
                        <li><a href="#">直播课</a></li>
                        <li><a href="#">班课</a></li>
                        <li><a href="#">题库</a></li>
                        <li><a href="#">实训</a></li>
                        <li><a href="#">资讯</a></li>
                    </ul>
                </div>
                <div class="t_siten_r">
                    <ul>
                        <li><a href="#" style="color:#057edb">Zesin</a><span style="padding:0 5px;">,</span><a href="#">退出</a></li>
                        <li class="hide"><a href="#">请登入</a></li>
                        <li class="hide"><a href="#">免费注册</a></li>
                        <li><a href="#">个人中心</a></li>
                        <li><a href="#">关于我们</a></li>
                        <li>
                            <a class="tit" href="#">帮助中心<i></i></a>
                            <div class="itShowbox">
                                <p><a href="#">副本1</a></p>
                                <p><a href="#">副本2</a></p>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <!--end 顶部-->
        </div>
    </div>
	<!--end  header-->
    <!--star 播发器-->
    <div class="fix b-121212">
    	<div class="fix w1200 ir c-f4f4f4">
        	<!--star videoPlayer-->
        	<div class="videoPlayer">
            	<div class="vio_source">
                	<video controls="controls" style="width:100%; height:100%;" src="http://www.w3school.com.cn/i/movie.ogg" type="video/mp4"></video>
                </div>
                <div class="vio_share h55 oh p-lr20 fwb">
                	<a href="javascript:;"><img src="skin/img/ico_2525_coll.png"><span class="p-l5">评价课程</span></a>
                	<a href="javascript:;" class="r"><img src="skin/img/ico_2525_share.png"><span class="p-l5">分享</span></a>
                </div>
            </div>
        	<!--end videoPlayer-->
        	<!--star vioColumn-->
            <div class="vioRightbox">
            	<div class="vio_depress l"><span>&gt;</span></div>
            	<div class="vio_column l">
                	<div class="c_tit"><span class="fs16 c-057edb">目录</span></div>
                    <div class="c_con fix">
                	<dl>
                    	<dt>1章 会计法律制度</dt>
                        <dd>
                        	<div class="curr"><a href="javascript:;">01 会计法律制度的构成</a><i></i></div>
                        	<div><a href="javascript:;">02 会计法成</a><i>图标</i></div>
                        	<div><a href="javascript:;">03 会计监督</a><i>图标</i></div>
                        	<div><a href="javascript:;">04 会计机构和会计人员</a><i>图标</i></div>
                        	<div><a href="javascript:;">05 法律责任</a><i>图标</i></div>
                        </dd>
                    </dl>
                	<dl>
                    	<dt>2章 会计法律制度</dt>
                        <dd>
                        	<div><a href="javascript:;">01 会计法律制度的构成</a><i></i></div>
                        	<div><a href="javascript:;">02 会计法成</a><i>图标</i></div>
                        	<div><a href="javascript:;">03 会计监督</a><i>图标</i></div>
                        	<div><a href="javascript:;">04 会计机构和会计人员</a><i>图标</i></div>
                        	<div><a href="javascript:;">05 法律责任</a><i>图标</i></div>
                        </dd>
                    </dl>
                	<dl>
                    	<dt>3章 会计法律制度</dt>
                        <dd>
                        	<div><a href="javascript:;">01 会计法律制度的构成</a><i></i></div>
                        	<div><a href="javascript:;">02 会计法成</a><i>图标</i></div>
                        	<div><a href="javascript:;">03 会计监督</a><i>图标</i></div>
                        	<div><a href="javascript:;">04 会计机构和会计人员</a><i>图标</i></div>
                        	<div><a href="javascript:;">05 法律责任</a><i>图标</i></div>
                        </dd>
                    </dl>
                    </div>
                </div>
            </div>
        	<!--end vioColumn-->
            <script src="skin/js/jquery.nicescroll.min.js"></script>
			<script>
			$(function(){
				var cn = $('.vio_column'),vp = $('.videoPlayer');
				cn.find('.c_con').niceScroll({ 
					cursorcolor: "#444444",//#CC0071 光标颜色 
					cursoropacitymax: 1, //改变不透明度非常光标处于活动状态（scrollabar"可见"状态），范围从1到0 
					touchbehavior: true, //使光标拖动滚动像在台式电脑触摸设备 
					cursorwidth: "8px", //像素光标的宽度 
					cursorborder: "0", //游标边框css定义 
					cursorborderradius: "8px",//以像素为光标边界半径 
					autohidemode: true //是否隐藏滚动条 
				});
				$('.vio_depress').bind('click', function(){
					if(cn.is(':visible')){//如果显示点击隐藏
						$(this).find('span').text('<');
						cn.hide();
						vp.css({'width':'100%'});
					}else{//如果隐藏点击显示
						$(this).find('span').text('>');
						cn.show();
						vp.removeAttr('style');
					}
				});
			});
			</script>
        </div>
    </div>
    <!--end 播发器-->
	<!--star main-->
    <div class="wrap_main fix">
        <!--content star-->
        <div class="col_main">
        	
            <div class="box_item m-t35 line-all b-FFFFFF">
            	<div class="p-lr30">
                	<div class="p-tb25 LH40 fix">
                    	<div class="l">
                    	<div class="fs22">会计证《财经法规》(2016版)</div>
                        <div class="fs14 c-999999">
                        	<span>课时总数<em class="c-333333 p-l5">12</em></span>
                            <span class="p-l20 m-r20 h10 oh line-right inlick"></span>
                        	<span>学习有效期<em class="c-333333 p-l5">1250天</em></span>
                            <span class="p-l20 m-r20 h10 oh line-right inlick"></span>
                        	<span>学习次数<em class="c-333333 p-l5">2.8万</em></span>
                            <span class="p-l20 m-r20 h10 oh line-right inlick"></span>
                        	<span>学生满意度<em class="c-333333 p-l5">98.79％</em></span>
                            <a class="c-057edb" href="#">（查看评价）</a>
                        </div>
                        </div>
                        <div class="r tac" style="width:320px;">
                        	<div class="fs20 c-999999">还剩11节课,加油哦！</div>
                            <div class="progressBar2 u1 m-t10">
                            	<div class="subBar u1" style="width:25%"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!--star-->
            <div class="box_item m-t40">
                <div class="mtcBox">
                    <div class="mt h30">
                        <span class="fs16 c-333333 p-lr10">课程评价<span class="c-ff5215 p-l10">(75)</span></span>
                    </div>
                    <div class="mc fix line-top" style="border-bottom:none;">
                        <div class="l LH50 tac p-t30" style="width:350px;">
                            <div class="p30">
                                <div class="p-lr50">
                                    <div class="c-ff5215" style="font-size:50px;">95％</div>
                                    <div class="fs16 c-999999">满意度</div>
                                </div>
                            </div>
                        </div>
                        <div class="l p30 fs14 s_pinjialist">
                            <ul>
                                <li class="item">
                                    <div class="tit l"><span>好评</span><span class="c-999999 p-l10">(64)</span></div>
                                    <div class="progressBar m-t10 l">
                                        <div class="subBar" style="width:75%"></div>
                                    </div>
                                </li>
                                <li class="item">
                                    <div class="tit l"><span>中评</span><span class="c-999999 p-l10">(64)</span></div>
                                    <div class="progressBar m-t10 l">
                                        <div class="subBar" style="width:25%"></div>
                                    </div>
                                </li>
                                <li class="item">
                                    <div class="tit l"><span>差评</span><span class="c-999999 p-l10">(64)</span></div>
                                    <div class="progressBar m-t10 l">
                                        <div class="subBar" style="width:100%"></div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                        
                    </div>
                </div>
                
            	<div class="fix line-all b-FFFFFF shipincons">
                    <!--star课程评价 -->
                    <div class="fix c">
                        <div class="fs14 s_pingNeirong" xljs-name="xljs-tab2">
                            <div class="mt tabBar" xljs-name="xljs-radio">
                                <span class="tit"><input type="radio" name='s'><label><i class="ico_radio"></i>全部</label></span>
                                <span class="tit"><input type="radio" name='s'><label><i class="ico_radio"></i>好评</label></span>
                                <span class="tit"><input type="radio" name='s'><label><i class="ico_radio"></i>中评</label></span>
                                <span class="tit"><input type="radio" name='s'><label><i class="ico_radio"></i>差评</label></span>
                            </div>
                            <div class="mc fix tabCon">
                                <!--star 全部-->
                                <div class="divitem">
                                    <dl class="fix line-bottom p-b20 m-b20">
                                        <dt class="ith_img img7070 m-r20 l"><img src="skin/temp/100.jpg"></dt>
                                        <dd class="LH20 p-t5">
                                            <div class="fix">
                                                <div class="fs16 p-tb10">金标</div>
                                                <div class="l c-666666" style="width:800px">视频很清晰，老师教的也很仔细，学到了很多知识！</div>
                                                <div class="r fs16 c-999999">2016-06-12</div>
                                            </div>
                                        </dd>
                                    </dl>
                                    <dl class="fix line-bottom p-b20 m-b20">
                                        <dt class="ith_img img7070 m-r20 l"><img src="skin/temp/100.jpg"></dt>
                                        <dd class="LH20 p-t5">
                                            <div class="fix">
                                                <div class="fs16 p-tb10">金标</div>
                                                <div class="l c-666666" style="width:800px">视频很清视频很清晰视频很清晰视频很清晰视频很清晰视频很清晰视频很清晰视频很清晰视频很清晰视频很清晰视频很清晰视频很清晰，老师教的也很仔细，学到了很多知识！</div>
                                                <div class="r fs16 c-999999">2016-06-12</div>
                                            </div>
                                        </dd>
                                    </dl>
                                    <dl class="fix line-bottom p-b20 m-b20">
                                        <dt class="ith_img img7070 m-r20 l"><img src="skin/temp/100.jpg"></dt>
                                        <dd class="LH20 p-t5">
                                            <div class="fix">
                                                <div class="fs16 p-tb10">金标</div>
                                                <div class="l c-666666" style="width:800px">视频很清晰，老师教的也很仔细，学到了很多知识！</div>
                                                <div class="r fs16 c-999999">2016-06-12</div>
                                            </div>
                                        </dd>
                                    </dl>
                                </div>
                                <!--end 全部-->
                                <!--star 好评-->
                                <div class="divitem">
                                    好评
                                </div>
                                <!--end 好评-->
                                <!--star 中评-->
                                <div class="divitem">
                                    中评
                                </div>
                                <!--end 中评-->
                                <!--star 差评-->
                                <div class="divitem">
                                    差评
                                </div>
                                <!--end 差评-->
                            </div>
                        </div>
                    </div>
                    <!--star分页-->
                    <div class="pages m-tb20">
                        <ul>
                            <li><span>&lt;</span></li>
                            <li><a href="">1</a></li>
                            <li class="curr"><a href="">2</a></li>
                            <li><a href="">3</a></li>
                            <li><span>&gt;</span></li>
                            <li>100 条 2/4 页</li>
                        </ul>
                    </div>
                    <!--end分页-->
                    </div>
                    <!--end课程评价 -->
                </div>
                
            	<div class="fix" style="height:90px;"></div>
                
            </div>
            <!--end-->
        </div>
        <!--content end-->
    </div>
	<!--end  main-->
    <!--star  footer-->
    <div class="footer b-FFFFFF">
    <script type="text/javascript">
        $(".footer").load("public_html/footer.html");
    </script>
    </div>
    <!--end  footer-->
</div>
</body>
</html>

